Zurück in SoftwareentwicklungWeiter in SoftwareentwicklungArbeit mit HTML Help Workshop Überblick ?

Dieses Thema führt in die Hilfeerstellung mit HTML Help Workshop (HHW) ein. Am besten veranschaulichen Sie die einzelnen Punkte am Beispiel von TESTS.chm.

Projektdateien

HHW verarbeitet und erzeugt vor allem Dateien der folgenden Typen:

Erweiterung Bedeutung Zweck Werkzeug
.chm compiled help by Microsoft kompilierte Hilfedatei HHW
.hhp HTML Help Project zusammenfassende Projektdatei HHW oder Texteditor
.htm Hypertext Markup HTML-Datei eines Hilfethemas Web- oder Texteditor
.css Cascading Style Sheet Formatvorlage für eine HTML-Datei Web- oder Texteditor
.js Java Script Glossardefinitionen Texteditor
.gif, .jpg internetfähige Grafikdatei Grafikdateien der HTML-Dateien Grafikeditor

Die blau markierten Projektdateien sind unbedingt erforderlich für die Kompilation einer .chm-Datei. Die grau markierten Dateien können die Präsentation und das Verständnis der Hilfetexte erleichtern. Am besten suchen Sie in den Verzeichnissen Hilfe und Fallbeispiel TESTS nach den entsprechenden Dateien und öffnen sie mit einer Anwendung der Spalte Werkzeug. Dateien mit den Erweiterungen .hhp, .htm., .css, und .js lassen sich auch mit einem gewöhnlichen Texteditor bearbeiten. Er bietet oft einen besseren Überblick und erleichtert Ersetzungen.

VorgehensschritteEntwicklungsschritte

Projektverzeichnis einrichten

Falls HHW nicht bereits in \Program Files\HTML installiert ist, richten Sie ihn mit HtmlHelp.exe ein. Stellen Sie sicher, dass eine Kopie des CD ROM-Verzeichnisses meineHilfe auf Ihre Festplatte liegt. Seine Themenskelette und das Verzeichnis images helfen Ihnen Ihre eigene .chm-Datei zu erstellen.

Falls Sie das Verzeichnis meineHilfe anderswohin kopieren und seine Dateien umbenennen möchten, dann gehen Sie wie folgt vor:

  1. Kopieren Siedas Verzeichnis meineHilfe und das Unterverzeichnis images an den gewünschten Ort
  2. Ändern Sie allenfalls die Namen der Dateien des Verzeichnisses meineHilfe.
  3. Öffnen Sie die .hhp-Datei in einen Texteditor und ersetzen Sie analog zu Ziff. 2 die ursprünglichen Dateinamen mit den neuen Namen.

Aufgabe Mit einem Doppelklick auf die .hhp-Datei und anschliessender Kompilation können Sie prüfen, ob sich die .chm-Datei wunschgemäss verhält.

Hilfetexte verfassen

Nachdem Sie wissen wie Sie den gesamten Hilfeinhalt auf einzelne Hilfethemen (HTML-Dateien) verteilen, können Sie die Themen in Word oder einem Webeditor wie FrontPage formulieren. Ein Hilfethema unterscheidet sich kaum von einer gewöhnlichen Webseite. Neu sind nur einige hilfetypische Funktionen (vgl. Ziff. 3), insbesondere ...

Das Verzeichnis meineHilfe enthält Vorlagen, die Sie vervollständigen können. Vorlagen - zum Beispiel LeeresBedienungsthema.htm oder LeeresEntwicklungsthema.htm - sind Skelette, welche die Erstellung neuer Bedienungs- oder Entwicklungstexte erleichtern.

In FrontPage, Word oder einem Texteditor können Sie den HTML-Code bestehender Themen inspizieren. Wenn Sie sich in einer kompilierten Hilfedatei (.chm) befinden, sehen Sie nach »Rechtsklick/Properties den Dateipfad und nach »Rechtsklick/View Source den HTML-Code des gerade präsentierten Hilfetexts.

Aufgabe Schauen Sie sich den Dateipfad und den HTML-Code dieses Hilfethemas an.

Benennen Sie Ihre HTML-Dateien möglichst verständlich (zum Beispiel "Bedienung.htm" statt "Bed.htm"). Idealerweise stimmt ausserdem der Dateiname mit dem Thematitel und dem Eintrag im Inhaltsverzeichnis überein.

Themen mit Hyperlinks verbinden

Die wichtigsten Kategorien von Hyperlinks sind ...

Links zu ... Beispiel
1 einem Thema der laufenden .chm-Datei Verweis auf ein anderes Thema
2 einem Thema einer anderen .chm-Datei Verweis auf ein Hilfethema von Access
3 einer Webseite Verweis auf ein Thema auf einem Webserver
4 einer Glossardefinition Klicken Sie auf Endbenutzerwerkzeuge
5 einer externen Anwendung Klicken Sie auf QuadratProgrammiertDialog.xls

Sie finden in TESTS.chm Links aller Kategorien. Zu den Kategorien 1 und 2 zählen insbesondere die Navigationslinks von TESTS.chm (Weiter in Tabellenblattentwicklung und Zurück in Tabellenblattentwicklung). Sie führen - je nach Farbe - zum nächsten bzw. vorangehenden Thema einer bestimmten Lernsequenz (Curriculum).

HEAD

Wenn Sie das Element <HEAD.../HEAD> von ...\meineHilfe\LeeresBedienungsthema.htm betrachten, finden Sie die folgenden Bestandteile:

a) Verweis auf das Stylesheet

Der Kopf (HEAD.../HEAD) einer Hilfedatei enthält einen Verweis auf ein .css-Stylesheet (cascaded style sheet). Ein Stylesheet enthält Layoutvorschriften. Um das Layout von TESTS.chm zu wählen, verweist jeder Themenkopf entweder auf das Stylesheet TESTSAnleitung.css (Bedienungshilfe) oder TESTSHintergrund.css (Entwicklerhilfe).

b) Verweis auf die Glossardatei

Damit ein Glossarlink funktioniert, muss der Kopf der Hilfedatei den folgenden Code enthalten: 

<OBJECT 
  id=
HHCTRL  
  type=
"application/x-oleobject"
  classid=
"clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11"
>
</OBJECT>
<SCRIPT 
  language=javascript
  SRC="Glossar.js">
</SCRIPT>
.

Die Datei Glossar.js (Java Script) befindet sich im gleichen Verzeichnis wie die .chm-Datei und enthält Zeilen des Formats ...

<adDefiniendum>="<Definiens>"

<adDefiniendum> ist der zu definierende Glossarbegriff (zum Beispiel "Endbenutzerwerkzeuge") und <Definiens> die Definition. Wenn Sie zum Beispiel auf den Glossarlink Endbenutzerwerkzeuge klicken, dann führt der Web Browser den folgenden HTML-Code aus:

<a href="JavaScript:HHCTRL.TextPopup(Endbenutzerwerkzeuge,popfont,9,9,-1,-1)"
  title=
"Kurzdefinition">
  <font color=
"green">Endbenutzerwerkzeuge</font>
</a>

Das Argument Endbenutzerwerkzeuge der Java Script-Prozedur TextPopup nennt das Schlüsselwort, nach dem in Glossar.js gesucht werden soll. Der gesuchte Eintrag in Glossar.js lautet für dieses Beispiel:

Endbenutzerwerkzeug="Ein Endbenutzerwerkzeug ist ein Programm, das auch von einem Anwender
ohne Programmierkenntnisse bedient werden kann. Beispiele sind Textverarbeitungs- und
Tabellenkalkulationspakete. Der Übergang von Endbenutzerwerkzeugen zu Programmierwerkzeugen
ist fliessend, weil die meisten Endbenutzerwerkzeuge eine eingebaute Makro- oder
Programmiersprache wie Visual Basic für Applikationen enthalten."

Achten Sie sorgfältig auf die Syntax der Einträge von Glossar.js. Ein Syntaxfehler macht sich erst dann bemerkbar, wenn Sie in *.chm ein Hilfethema mit einem Verweis auf die fehlerhafte Definition öffnen. Am besten testen Sie deshalb die Syntax nach jeder neuen Definition, indem Sie Glossar.js ausführen (doppelt auf Glossar.js klicken).

c) Schlüsselwörter für das Indexregister

Mit der folgenden Vorlage können Sie einem Thema eine beliebige Zahl von Schlüsselwörtern (engl. keywords) zuordnen:

<Object 
  type="application/x-oleobject" classid="clsid:1e2a7bd0-dab9-11d0-b93a-00c04fc99f9e">
  <param name=
"Keyword" value="Ein erstes Keyword">
  <param name=
"Keyword" value="...">
</OBJECT>

(Sie können Keywords auch unter dem HTML Help Workshop einfügen. Siehe Hilfe)

Die Vorlagen des Verzeichnisses meineHilfe enthalten bereits Stylesheet-, Glossar- und Indexanweisungen. Glossar.js passen Sie mit einem Texteditor an, und einen Glossarlink geben Sie ähnlich wie einen konventionellen Hyperlink ein (zum Beispiel im Hyperlinkmenü von FrontPage oder direkt im HTML-Quellcode).

Inhaltsverzeichnis nachführen

Starten Sie die .hhp-Datei des Verzeichnisses meineHilfe. Im Register Inhalt können Sie das Inhaltsverzeichnis um die HTML-Themen erweitern, die Sie in Schritt 2 erstellt haben. Einen Blattknoten des Inhaltsverzeichnis (einen Eintrag, der keinen Untereintrag mehr hat) fügen Sie mit einem Klick auf die Schaltfläche "Insert a heading" ein. Zwischenknoten erfordern einen Klick auf "Insert a page". Bezeichnen Sie einen Knoten des Inhaltsverzeichnisses gleich oder ähnlich wie die entsprechende HTML-Datei. Das Symbol eines Eintrags können Sie mit einem Klick auf "Edit Selection" anpassen.

Hilfetexte in eine .chm-Datei kompilieren

Wenn Sie die in Phase 4 eingefügten HTML-Texte kompilieren möchten, dann klicken Sie in der .hhp-Datei auf das Kompilationssymbol.